<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>交安设施运维平台</title>
    <meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport">
    <link rel="shortcut icon" href="images/logo_mini.png">
    <link rel="stylesheet" href="plugins/bootstrap/css/bootstrap.min.css">
    <link rel="stylesheet" href="plugins/bootstrapValidator/bootstrapValidator.min.css">
    <link rel="stylesheet" href="plugins/font-awesome/css/font-awesome.min.css">
    <link rel="stylesheet" href="plugins/ionicons/css/ionicons.min.css">
    <link rel="stylesheet" href="plugins/dist/css/AdminLTE.min.css">
    <link rel="stylesheet" href="plugins/iCheck/square/blue.css">
    <style>
        #header {
            height: 20px;
            width: 100%;
            position: relative; /*父div的位置设置成相对的*/
            top: 0;
        }

        .mydiv {
            background: #ffffff;
            background-color: rgba(255, 255, 255, 0.4);
            width: 370px;
            float: left;
            border-radius: 18px;
        }

        .myspan {
            border-top-left-radius: 5px !important;
            border-bottom-left-radius: 5px !important;
            background: #e6e6e6 !important;
        }

        .myinput {
            background: #e6e6e6;
            width: 274px !important;
            height: 50px !important;
            border-top-right-radius: 6px !important;
            border-bottom-right-radius: 6px !important;
        }

        .mytest {
            color: #ffffff;
            font-size: 16px;
            padding-right: 3px;
        }

        body {
            font-family: 'Microsoft Yahei', '微软雅黑', '宋体', Tahoma, Arial;
            margin: 0;
            letter-spacing: 1px;
            font-size: 15px;
        }

        .myBtn {
            border-radius: 6px !important;
            width: 324px;
            font-size: 20px;
            color: #666666 !important;
        }

        .myhead {
            font-size: 18px;
            color: #FFFFFF;
            margin-right: 233px;
        }

        .myfoot {
            color: #ffffff;
            font-size: 16px;
            padding-right: 11px;
        }

        .mybody {
            background: url('./images/bg_image.png');
            background-size: cover;
            margin-bottom: 0px;
        }
    </style>
    <script src="plugins/html5shiv/html5shiv.min.js"></script>
    <script src="plugins/respond/respond.min.js"></script>
</head>
<body class="jumbotron mybody">
<div id="header"></div>
<div class="container">
    <div class="row">
        <div class="col-md-4"></div>
        <div class="col-md-4">
            <div>
                <div style="width: 370px">
                    <img style="width: 188px" src="images/logo_dark.png">
                    <div class="row">
                        <h3 style="padding-left: 200px;"><b>交安设施运维平台</b></h3>
                    </div>
                </div>
                <div class="mydiv">
                    <div class="login-box" style="width: 321px" align="center">
                        <p class="myhead">
                            <b>用户登录</b>
                        </p>
                        <form id="form-login" method="post">
                            <div class="form-group has-feedback">
                                <div class="input-group input-group-lg">
                                <span class="input-group-addon myspan">
                                    <span class="glyphicon glyphicon-user">
                                    </span>
                                </span>
                                    <input type="text" class="form-control myinput"
                                           id="loginName"
                                           name="loginName" placeholder="账号">
                                </div>
                            </div>
                            <div class="form-group has-feedback" style="margin-top: 20px">
                                <div class="input-group input-group-lg">
                                <span class="input-group-addon myspan">
                                    <span class="glyphicon glyphicon-lock">
                                    </span>
                                </span>
                                    <input type="password" class="form-control myinput"
                                           id="passWord"
                                           name="passWord" placeholder="密码">
                                </div>
                            </div>
                            <div class="form-group has-feedback" style="margin-top: 20px">
                                <div class="input-group input-group-lg">
                                    <span class="input-group-addon myspan">
                                        <span class="glyphicon glyphicon-retweet">
                                        </span>
                                    </span>
                                    <input type="text" class="form-control myinput"
                                           id="inputCode" autocomplete="off"
                                           name="inputCode" placeholder="验证码">
                                    <img id="imgCode" src="rds_captcha/getCaptcha" onclick="$.refreshCode()"
                                         style="position: absolute; left: 226px; top: 1px; height: 48px; width: 99px;
                                           z-index: 1010;border-bottom-right-radius: 6px; border-top-right-radius: 6px">
                                </div>
                            </div>
                            <div class="row" style="margin-top: 10px;">
                                <a href="#" style="float: right;">
                                    <b class="myfoot">忘记密码</b>
                                </a>
                            </div>
                            <div class="row" style="margin-top: 18px;margin-bottom: 30px;">
                                <div class="col-sm-12">
                                    <button type="submit" class="btn btn-lg btn-block btn-flat myBtn">
                                        <b>登&nbsp;&nbsp;录</b></button>
                                </div>
                            </div>

                        </form>
                    </div>
                </div>
            </div>
            <div class="col-md-4"></div>
        </div>
    </div>
</div>
<div>
    <div style="width: 100%; text-align: center; height: 40px;
    color:#bfbfbf;padding: 10px;position:fixed; bottom:0;font-size: 14px;">
        Copyright©2017 宁波华路德交通设备科技有限公司 版权所有
    </div>
</div>
<script src="plugins/jQuery/jquery-2.2.3.min.js"></script>
<script src="plugins/bootstrap/js/bootstrap.min.js"></script>
<script src="plugins/bootstrapValidator/bootstrapValidator.min.js"></script>
<script src="plugins/bootbox/bootbox.min.js"></script>
<script src="plugins/iCheck/icheck.min.js"></script>
<script src="login.js"></script>
</body>
</html>
